import React from 'react';
import ReactDOM from 'react-dom';
import Preview from './lib/light-render/mobile';

class MobilePreview extends React.Component {
  state = {
    value: {},
  };

  componentDidMount() {
    window.addEventListener('message', this.handleMessage);
  }

  componentWillUnmount() {
    window.removeEventListener('message', this.handleMessage);
  }

  handleMessage = event => {
    if (event.data) {
      const value = JSON.parse(event.data);
      this.setState({ value });
    }
  };

  render() {
    const { value } = this.state;
    return <Preview value={value} />;
  }
}

ReactDOM.render(<MobilePreview />, document.getElementById('root'));
